@fontColor : #212121;
@fontLightColor : #727272;
@escapedColor: escape(@primary);

body:not(.popupBody) {
    color: @fontColor;
    background-color: #fff;
}
body.embeded {
    background-color: transparent;
}
header.navbar {
    background-color: @primary;
    box-shadow: 0 2px 5px rgba(0, 0, 0, .3);
}
header.navbar .header-nav {
    background-color: @primary;
}
main .reset_position,
main .grid-stack-item-header-action,
a {
    color: @accent;
}
.dataList table a {
    color: darken(@accent, 5%);
}
.dataList table a:hover,
a:focus, a:hover {
    color: @lightAccent;
}
header.navbar a {
    color: @defaultFontColor;
}
#header-name a {
    padding: 7px 10px;
    color: @defaultFontColor;
}
.hi-trigger:before {
    background: @primary;
}
.line-wrap .line {
    background-color: @defaultFontColor;
}
.nav .open>a, .nav .open>a:focus, .nav .open>a:hover,
header.navbar .header-nav .nav>li>a.btn:focus, header.navbar .header-nav .nav>li>a.btn:hover {
    background-color: fade(@defaultFontColor, 4%);
    color: #D8DADA;
    border-color:fade(@defaultFontColor, 4%); 
}
header.navbar .header-nav .nav>li>a .badge{
    background: #C13228;
}
header.navbar .dropdown-menu a{ 
    color: #000;
}
header.navbar .dropdown-menu .dropdown-menu-sub-footer {
    color: #828282;
}
header.navbar .dropdown-menu a span.message, header.navbar .dropdown-menu a span.time {
    color: #4C4C4C;
}
li.dropdown-menu-title {
    border-bottom: 1px solid #F0F0F0;
    color: #4C4C4C;
}
#sidebar {
    background: @lightPrimary;
    box-shadow: 0 1px 1px rgba(0,0,0,.1);
}
#page > footer {
    color: rgba(0,0,0,.65);
}
@media (max-width:1279px) {
    #sidebar {
        box-shadow: 0 0px 10px #0E1215
    }
}
body#login #main > div {
    background: transparent;
}
.breadcrumb,
.breadcrumb a {
    color: @fontLightColor;
}
.breadcrumb a:last-child {
    color: @lightAccent;
}
body.horizontal_menu #sidebar a,
#sidebar li ul li.active a, #sidebar li ul li.active a,
#sidebar li ul a:focus, #sidebar li ul a:hover,
.main-menu.nav>li>a:focus, .main-menu.nav>li>a:hover,
.main-menu.nav-tabs>li.active>a, .main-menu.nav-tabs>li.active>a:focus, .main-menu.nav-tabs>li.active>a:hover,
.main-menu.nav-tabs .active>a, .main-menu.nav-tabs a.active, .main-menu.nav-tabs a:hover {
    color: @menuFont;
}
.main-menu.nav-tabs>li>a {
    color: fade(@menuFont, 65%);
}
.main-menu.nav>li>a:focus, .main-menu.nav>li>a:hover,
.main-menu.nav-tabs>li.active>a, .main-menu.nav-tabs>li>a:hover {
    background-color: fade(@menuFont, 4%);
}
.main-menu.nav-tabs > li.mm-profile a img {
    box-shadow: 0 0 0 2px fade(@menuFont, 13%);
}
.main-menu.nav-tabs > li.mm-profile a small{
    color: fade(@menuFont, 70%);
}
.main-menu.nav-tabs > li.mm-profile a small.login_link{
    color:@accent;
}
.main-menu.nav-tabs > li.mm-profile a:focus small.login_link, .main-menu.nav-tabs > li.mm-profile a:hover small.login_link {
    color: @lightAccent;
}
#sidebar li ul a {
    color: fade(@menuFont, 70%);
}
@media (min-width:768px) {
    body.horizontal_menu #sidebar {
        background: screen(@primary, #333333);
    }
    body.horizontal_menu.inline_menu #sidebar {
        background: @primary;
    }
    body.horizontal_menu #sidebar .nav>li ul{
        background: @primary;
    }
    body.horizontal_menu.inline_menu #sidebar .nav>li ul{
        background: @primary;
    }
    body.horizontal_menu.inline_menu #sidebar .main-menu.nav-tabs>li.active>a{
        box-shadow: 0 2px 0 0 @defaultFontColor;
    }
    body.horizontal_menu.inline_menu header.navbar .header-nav .nav>li.user-link img {
        border: 2px solid fade(@defaultFontColor, 13%);
    }
    body.horizontal_menu #sidebar a,
    body.horizontal_menu #sidebar li ul li.active a, body.horizontal_menu #sidebar li ul li.active a,
    body.horizontal_menu #sidebar li ul a:focus, body.horizontal_menu #sidebar li ul a:hover,
    body.horizontal_menu .main-menu.nav>li>a:focus, body.horizontal_menu .main-menu.nav>li>a:hover,
    body.horizontal_menu .main-menu.nav-tabs>li.active>a, body.horizontal_menu .main-menu.nav-tabs>li.active>a:focus, body.horizontal_menu .main-menu.nav-tabs>li.active>a:hover,
    body.horizontal_menu .main-menu.nav-tabs .active>a, body.horizontal_menu .main-menu.nav-tabs a.active, body.horizontal_menu .main-menu.nav-tabs a:hover {
        color: @defaultFontColor;
    }
    body.horizontal_menu .main-menu.nav-tabs>li>a {
        color: fade(@defaultFontColor, 65%);
    }
    body.horizontal_menu .main-menu.nav>li>a:focus, body.horizontal_menu .main-menu.nav>li>a:hover,
    body.horizontal_menu .main-menu.nav-tabs>li.active>a, body.horizontal_menu .main-menu.nav-tabs>li>a:hover {
        background-color: fade(@defaultFontColor, 4%);
    }
    body.horizontal_menu .main-menu.nav-tabs > li.mm-profile a img {
        box-shadow: 0 0 0 2px fade(@defaultFontColor, 13%);
    }
    body.horizontal_menu .main-menu.nav-tabs > li.mm-profile a small{
        color: fade(@defaultFontColor, 70%);
    }
    body.horizontal_menu #sidebar li ul a {
        color: fade(@defaultFontColor, 70%);
    }
}
body:not(#login) #content > main > div:not(.quickEdit),
body:not(#login) #content > main > table{
    background: #fff;
}
body:not(#login).embeded #content > main > div:not(.quickEdit),
body:not(#login).embeded #content > main > table{
    background: transparent;
}
.page-loader {
    background: @primary;
}
.page-loader .preloader p {
    color: @defaultFontColor;
}
.preloader .plc-path, .plc-path {
    stroke: @defaultFontColor;
}
.btn, .btn.focus, .btn:focus, .btn:hover, .btn:active {
    color: @buttonText;
    background-color: @button;
}
.btn.waves-input-wrapper{
    color: @buttonText !important;
    background-color: @button !important;
}
main .dataList table {
    border-bottom: 2px solid @darkPrimary;
}
main .dataList th,
main .dataList th a:hover,
main .dataList th a{
    color: @defaultFontColor;
}
main .footable.breakpoint>tbody>tr>td>span.footable-toggle{
    color: @primary;
}
main .dataList th.sortable:hover {
    background-color: lighten(@darkPrimary , 1%);
}
main .dataList thead tr {
    background-color: fade(@primary, 80%);
}
main .dataList tr.odd, 
main .dataList tr.odd + tr.footable-row-detail{
    background-color: transparent;
}
main .dataList tr.tableRowEven, main .dataList tr.even,
main .dataList tr.tableRowEven + tr.footable-row-detail, main .dataList tr.even + tr.footable-row-detail{
    background-color: rgba(0,0,0,.1);
}
main .dataList span.pagelinks a, main .dataList span.pagelinks strong, main .dataList span.pagelinks > span {
    color: @accent;
    background-color: rgba(0,0,0,.05);
}
main .dataList span.pagelinks strong {
    color: @fontColor;
    background-color: rgba(0,0,0,.05);
}
main .dataList .pagelinks .pc.first-disabled,
main .dataList .pagelinks .pc.prev-disabled,
main .dataList .pagelinks .pc.next-disabled,
main .dataList .pagelinks .pc.last-disabled{
    color: fade(@defaultFontColor, 50%);
    background-color: rgba(0,0,0,.1);
}
div[class*="-body-content"] div[class*="-body-header"] {
    color: @fontColor;
}
main .jqplot-highlighter-tooltip, main .jqplot-canvasOverlay-tooltip {
    color: #000;
}
main ::-webkit-input-placeholder{
    color: @fontLightColor;
}
main :-moz-placeholder{
    color: @fontLightColor;
}
main ::-moz-placeholder{
    color: @fontLightColor;
}
main :-ms-input-placeholder{
    color: @fontLightColor;
}
main .filter-cell select.emptyValue {
    color: @fontLightColor !important;
}
main input:not([type]),
main input[type=text],
main input[type=password],
main input[type=email],
main input[type=url],
main input[type=time],
main input[type=date],
main input[type=datetime],
main input[type=datetime-local],
main input[type=tel],
main input[type=number],
main input[type=search],
main textarea,
main select:not([class^=ui]){
  background-color: transparent;
  border-bottom: 1px solid @darkPrimary;
  color: @fontColor;
}
main .ql-container.ql-bubble {
  border-bottom: 1px solid @darkPrimary;
}
main input:not([type]):focus:not([readonly]),
main input[type=text]:focus:not([readonly]),
main input[type=password]:focus:not([readonly]),
main input[type=email]:focus:not([readonly]),
main input[type=url]:focus:not([readonly]),
main input[type=time]:focus:not([readonly]),
main input[type=date]:focus:not([readonly]),
main input[type=datetime]:focus:not([readonly]),
main input[type=datetime-local]:focus:not([readonly]),
main input[type=tel]:focus:not([readonly]),
main input[type=number]:focus:not([readonly]),
main input[type=search]:focus:not([readonly]),
main textarea:focus:not([readonly]),
main select:focus:not([readonly]):not([class^=ui]),
main input.focus,
main .ql-container.ql-bubble.focus {
  border-bottom: 1px solid @primary;
  box-shadow: 0 1px 0 0 @primary;
}
main textarea {
  background-color: transparent;
}
main select:not([class^="ui-"]):not([multiple]) {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='@{escapedColor}' d='M7.406 7.828l4.594 4.594 4.594-4.594 1.406 1.406-6 6-6-6z'/%3E%3C/svg%3E");
}
main input:-webkit-autofill, main textarea:-webkit-autofill, main select:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px #fff inset;
    -webkit-text-fill-color: @fontColor !important;
}
main input:focus:-webkit-autofill, main textarea:focus:-webkit-autofill, main select:focus:-webkit-autofill {
    -webkit-box-shadow: 0 1px 0 0 @primary, 0 0 0px 1000px #fff inset !important;
}
main #form-canvas .label {
    color: @fontColor;
}
legend,
main #form-canvas .form-section-title span, main #form-canvas .subform-section-title span {
    background: fade(@primary, 80%);
    color:@defaultFontColor;
}
main .subform-container.has-frame .subform-title {
    background: #fff;
}
main .subform-container {
    border: 2px solid fade(@primary, 70%);
}
main .chosen-container-multi .chosen-choices,
main .chosen-container-single .chosen-single {
    border-bottom: 1px solid @darkPrimary;
    background-color: transparent;
    background: transparent;
    color: inherit;
}
main .chosen-container-single.chosen-with-drop .chosen-single {
    color: #000;
}
main .chosen-container-multi.chosen-container-active .chosen-choices,
main .chosen-container-active .chosen-single {
    border-bottom: 1px solid @primary;
    box-shadow: 0 1px 0 0 @primary;
}
main .multiPagedForm.wizard .page-nav-panel ul,
main .multiPagedForm.tab .page-nav-panel ul {
    box-shadow: inset 0 -2px 0 0 screen(@primary, #555555);
}
main .multiPagedForm.wizard .page-nav-panel .nav_item.current button,
main .multiPagedForm.wizard .page-nav-panel .nav_item button,
main .multiPagedForm.tab .page-nav-panel .nav_item.current button,
main .multiPagedForm.tab .page-nav-panel .nav_item button {
    color: screen(@primary, #555555);
}
main .multiPagedForm.wizard .page-nav-panel .nav_item.current button:disabled, main .multiPagedForm.tab .page-nav-panel .nav_item.current button:disabled, main .multiPagedForm.wizard .page-nav-panel .nav_item.current button, main .multiPagedForm.tab .page-nav-panel .nav_item.current button {
    color: @darkPrimary;
}
main .multiPagedForm.wizard .page-nav-panel .nav_item.current:after, main .multiPagedForm.tab .page-nav-panel .nav_item.current:after {
    background: @darkPrimary;
}
@media (max-width: 767px){
    main .multiPagedForm.wizard .page-nav-panel .nav_item button, main .multiPagedForm.tab .page-nav-panel .nav_item button {
        background: none;
        border: screen(@primary, #555555) solid 2px;
    }
    main .multiPagedForm.wizard .page-nav-panel .nav_item.current, main .multiPagedForm.tab .page-nav-panel .nav_item.current {
        border: 2px solid @darkPrimary;
    }
    main .multiPagedForm .page-container {
        border: 2px solid @darkPrimary;
    }
}
main .form-cell .grid thead tr, main .subform-cell .grid thead tr {
    background: #999;
    color: @defaultFontColor;
}
main .form-cell .grid tbody tr:nth-child(odd), main .subform-cell .grid tbody tr:nth-child(odd) {
    background-color: @lightPrimary;
}
main .form-cell .grid table.tablesaw, main .subform-cell .grid table.tablesaw{
    border-bottom: 2px solid #999;
}
main .grid-stack-item .grid-stack-item-header {
    background: @darkPrimary;
}
main .grid-stack-item .grid-stack-item-header h4 {
    color: @defaultFontColor;
}
main .grid-stack-item .grid-stack-item-content {
    border-color: transparent;
}
body.popupBody #main-body-header {
    background: @darkPrimary;
    color: @defaultFontColor;
}